<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>意达设计</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../css/swiper.min.css"/>
    <link rel="stylesheet" type="text/css" href="../css/dealer.css"/>
    <link rel="stylesheet" type="text/css" href="../css/member.css"/>

</head>
<body class="body">

<!-- header -->
<div class="detban">
	<img class="daimg" src="../image/page/img-022.jpg" id='icon'>
	<div class="detailheader">
		<a href="javascript:void(0);" onclick="api.closeWin();" class="retue"></a>
		<a href="javascript:void(0);" class="sharelink"></a>
	</div>
</div>

<div class="deltit"><span id='name'>HELEN手提时尚女包</span><a href="javascript:void(0)" style="display: none"></a></div>
<div class="delmony"><span id='price'>￥1688</span></div>

<div class="pad">
	<div class="modeli"><span>订单号</span> <em id='orderno'>2018091117361529</em></div>
	<div class="modeli"><a href="javascript:void(0)"><span>颜色</span> <em class="biIcon" id='mycolor'>红色</em></a></div>
	<div class="modeli"><a href="javascript:void(0)">数量<span></span> <em class="biIcon"  id='mynum'>X10</em></a></div>
	<div class="modeli"><span>总价</span> <p>¥<i id='money'>10050.00</i></span></p></div>
	<div class="modeli" id='jxs' style="display: none">
        <a href="javascript:;">经销商<span></span> <em class="biIcon">南岸区经销商</em></a></div>
</div>

<div class="nullbox"></div>
<div class="modeft">
	<input type="button" value="修改订单" onclick="xgorder()">
</div>

<!-- 弹框 -->
<div class="frameBox">
    <div class="frameCnt">
        <div class="ftit">
            <div class="ftoall">
                <div class="ftit_l"><img src="../image/page/img-025.jpg" id='icon1'></div>
                <div class="ftit_r">
                    <p id='goodsname1'>金狐狸包包女手提包</p>
                    <span id='goodscontent1'>#时尚搭配女包# chic时尚五金</span>
                </div>
                <div class="closeframe"></div>
            </div>
            <div class="frmlist">
                <p>选择颜色</p>
                <ul id='colors'>
                    <li class="finOn">红色</li>
                    <li>黄色</li>
                    <li>橙色</li>
                    <li>绿色</li>
                    <li>青色</li>
                    <li>蓝色</li>
                    <li>紫色</li>
                    <li>金色</li>
                </ul>
            </div>
            <div class="numbs">
                <div class="numbs_l">选择数量</div>
                <div class="numbs_r"><i class="zjbtn"></i><span class="choosenum" id='num'>1</span><i class="jsbtn"></i></div>
            </div>

            <!-- <div class="numbs" style="margin-top: 0; border-top: none;" id='showjxs'>
                <div class="numbs_l">选择经销商</div>
                <div class="numbs_r" style="display: flex; align-items: center;"><span style="width: auto; padding-right: .1rem" id='jxs' data-id="0"></span><i style="display: block;
                                               width: .2rem;
                                               height: .2rem;
                                               background: url(../image/icon/icon-029.png) no-repeat center;
                                               background-size: .1rem;"  onclick="choosejxs()"></i></div>
            </div>
           
            <div class="peson">配送至<span>(配送地可能会影响库存，请正确选择)</span></div>
            <div class="fmaddres">
                <a href="#"><span  data-id="0" id='addr'>请选择地址</span><i onclick="chooseaddr()"></i></a>
            </div> -->
        </div>
        <div class="feombtn"><input type="button" value="确定" onclick='chooseover()'></div>
    </div>
</div>

</body>

<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="../script/adaptive.js"></script>
<script type="text/javascript" src="../script/swiper.min.js"></script>
<script type="text/javascript" src="../script/tabs.js"></script>
<script type="text/javascript">
    window['adaptive'].desinWidth = 750;
    window['adaptive'].baseFont = 28;
    window['adaptive'].maxWidth = 750;
    window['adaptive'].init();


    var color=0;
    var num=0;
    var para='';
    apiready = function () {
        $api.fixStatusBar($api.dom('.header'));
        api.addEventListener({
            name: 'keyback'
        }, function(ret, err){
            api.closeWidget();
        });
        api.showProgress();

        para=api.pageParam;
    

    	var  p={token:token,id:para.id};

        toDoRequest(p);

        /*if(para.aid>0 || para.jid>0){
            info();
        }*/

        
	};
    function choosecolor(id){
        color=id;

        $('#mycolor').attr('data-id',id);

        var name=$('#c_'+id).html();
        $('#mycolor').html(name);

        $('#c_'+id).addClass('finOn').siblings().removeClass('finOn');
          
    };
    function info(){
        var jxsid=$api.getStorage('jxsid');
        var jxstxt=$api.getStorage('jxstxt');

            $('#jxs').attr('data-id',jxsid);
            $('#jxs').html(jxstxt);

        var addrid=$api.getStorage('addrid');
        var addrtxt=$api.getStorage('addrtxt');

            $('#addr').attr('data-id',addrid);
            $('#addr').html(addrtxt);

            $(".frameBox").show();
        

      
    }

    function toDoRequest(p){
        api.ajax({
            url: webSiteUrl+'/app/user/orderdetail',
            method: 'post',
            data: {
                values:p,
            }
        }, function(ret, err) {
            api.hideProgress();
            
            if(ret.code==200){
                
                //alert(ret.msg);return;
              
                var tj=ret.data;
                $('#icon').attr('src',webSiteUrl+tj.icon);
                $('#price').html(tj.price);
                $('#money').html(tj.money);
                
                $('#name').html(tj.name);
                $('#orderno').html(tj.orderno);
                $('#color').html(tj.color);
                $('#num').html(tj.num);

                $('#mycolor').html(tj.color);
                $('#mycolor').attr('data-id',tj.colorid);
                $('#mynum').html(tj.num);
                $('#mynum').attr('data-id',tj.num);


                $('#icon1').attr("src",webSiteUrl+tj.icon);
                $('#goodsname1').html(tj.name);
                $('#goodscontent1').html(tj.content);


                html = "";
                var tj=ret.data.colors;
                
                for(var i=0;i<tj.length;i++){
                    if(tj[i].id == ret.data.colorid){
                    html += '<li id="c_'+tj[i].id+'" onclick="choosecolor('+tj[i].id+')" class="finOn">'+tj[i].name+'</li>';
                    }else{
                    html += '<li id="c_'+tj[i].id+'" onclick="choosecolor('+tj[i].id+')">'+tj[i].name+'</li>';
                    }
                    
                    
                }
                $('#colors').html(html);

                        
            }else{
                        //alert(ret.msg)
                    }

        });
    }
    function chooseover () {
        num=parseInt($('#num').html());
        $('#mynum').html("x"+num);
        //addrid=$('#addr').attr('data-id');
        color=$('#mycolor').attr("data-id");

        if(color==0){
            alert('请选择颜色');return;
        }
        if(num==0){
            alert('请选择数量');return;
        }
        /*if(addrid==0){
            alert('请选择地址');return;
        }
        $(".frameBox").hide();*/

        var para=api.pageParam
        
        var p={token:token,oid:para.id,num:num,color:color};
        api.ajax({
            url: webSiteUrl+'/app/user/order',
            method: 'post',
            data: {
                values:p,
            }
        }, function(ret, err) {
            api.hideProgress();
            
            if(ret.code==200){
                alert(ret.msg)
                api.openWin({
                    name: 'shopName',
                    url: './myorder.html',
                    reload: true,
                    pageParam: {
                        type:1,
                    }
                });

            }else{
                alert(ret.msg)
            }
        })
    } 
	function xgorder(){
        $(".frameBox").show();

        //chooseover();
	  	
   	}

    function choosejxs () {
        api.openWin({
            name: 'shopName',
            url: './myuser.html',
            pageParam: {
                type:'xguser',
            }
        });
    }

    function chooseaddr () {
        //$api.setStorage('cartaddr',1);
        api.openWin({
            name: 'shopName',
            url: './myaddr.html',
            pageParam: {
                type:'xgaddr',
            }
        });
    }

   	function aaa(){ 
   		var para=api.pageParam
   		api.openWin({
            name: 'shopName',
            url: './member9.html',
            pageParam: {
                id: para.id
            }
        });
   	}
</script>

</html>
